<template>
  <div class="login"> 
    <div class="content">
      <div class="popup">
        <img src="@/assets/cn.png" class="lang" />
        <img src="@/assets/logo.png" class="logo" />
        <div class="inputGroup" :class="{ inputError: uInputError.account }">
          <h2>账号:</h2>
          <el-input
            v-model="uInput.account"
            placeholder="Email Address"
          ></el-input>
          <p class="errInfo" v-show="uInputError.account">
            请输入正确的用户名!
          </p>
        </div>
        <div class="inputGroup" :class="{ inputError: uInputError.password }">
          <h2>密码:</h2>
          <el-input
            v-model="uInput.password"
            placeholder="Your Password"
            show-password
          ></el-input>
          <p class="errInfo" v-show="uInputError.password">密码</p>
        </div>
        <router-link to="/" class="forgetPassword"> 忘记密码 </router-link>
        <el-button type="primary" class="loginBtn" @click.stop="loginClick">
          登录
        </el-button>
      </div>
    </div>

    <footer>
      <img src="@/assets/seeed.png" class="seeed" />
      <div class="copyright">
        <p>© 2008-2021 "lang.compony"</p>
        <a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank"
          >粤ICP备13058720号</a
        >
      </div>
      <router-link to=""> "lang.privacy"</router-link>
      <img src="@/assets/mcafee.png" class="mcafee" />
    </footer>
  </div>
</template>

<script> 

export default {
  name: "Login", 
  data() {
    return {
      uInput: {
        account: "super",
        password: "super",
      },
      uInputError: {
        account: !true,
        password: !true,
      },
    };
  },
  created() {},

  methods: {
    async loginClick() {},
  },
};
</script>

<style lang="less" scoped>
@import "./index.less";
</style>

<style lang="less">
.registerBtn > span {
  margin-left: -8px;
}
</style>
